<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>成绩查询</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
        <link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
        <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>

        <link rel="stylesheet" type="text/css" href="css/base.css">

        <script>
            $(document).ready(function(){
                var semester = '';
                var examtype = '';
                var grades = '';
                var classes = '';
                var stuname = '';
                var limit = 10;
                var offset = 0;
                var datalength = 0;
                var maxresult = 0;
                var chinesetotal = 0;
                var mathtotal = 0;
                var englishtotal = 0;
                var physicstotal = 0;
                var chemistrytotal = 0;
                var totaltotal = 0;
                var chinesemax = 0;
                var mathmax = 0;
                var englishmax = 0;
                var physicsmax = 0;
                var chemistrymax = 0;
                var chinesemaxname = '';
                var mathmaxname = '';
                var englishmaxname = '';
                var physicsmaxname = '';
                var chemistrymaxname = '';
                var maxstudent = '';
                var perm = '[[${session.perm}]]';
                
                function dataload(semester, examtype, grades, classes, stuname, limit, offset, datalength){
                    $.ajax({
                        type: "GET",
                        url: "/resultsearch",
                        data: {semester: semester, examtype: examtype, grades: grades, classes: classes, stuname: stuname, limit: limit, offset: offset},
                        dataType: 'json',
                        success:function(data){
                            var innertable = document.getElementById("exmatbl");
                            var innerstr = '';
                            if(perm == 1){
                                innerstr = '<tr style="background-color: #ccc;"><th>No</th><th>学号</th><th>姓名</th><th>学期</th><th>类别</th><th>班级</th><th>语文</th><th>数学</th><th>英语</th><th>物理</th><th>化学</th><th>总分</th></tr>';
                                for(var i = 0; i < data.data.length; i++){
                                    var chinese = data.data[i].Chinese;
                                    var math = data.data[i].Math;
                                    var english = data.data[i].English;
                                    var physics = data.data[i].Physics;
                                    var chemistry = data.data[i].Chemistry;
                                    if(chinese == null){
                                        chinese = '未录入';
                                    }
                                    if(math == null){
                                        math = '未录入';
                                    }
                                    if(english == null){
                                        english = '未录入';
                                    }
                                    if(physics == null){
                                        physics = '未录入';
                                    }
                                    if(chemistry == null){
                                        chemistry = '未录入';
                                    }
                                    var totalresult = data.data[i].Chinese + data.data[i].Math + data.data[i].English + data.data[i].Physics + data.data[i].Chemistry;

                                    innerstr += '<tr><th>' + String(i + 1 + offset) + '</th><th><a href="/mangeinto?id=' + String(data.data[i].id) + '">' + data.data[i].stu_id + '</a></th><th>' + data.data[i].name + '</th><th>' 
                                                + data.data[i].term + '</th><th>' + data.data[i].exam_type + '</th><th>' 
                                                + String(data.data[i].grade) + '年' + String(data.data[i].class_num) + '班</th><th>' 
                                                + String(chinese) + '</th><th>' + String(math) + '</th><th>' 
                                                + String(english) + '</th><th>' + String(physics) + '</th><th>' 
                                                + String(chemistry) + '</th><th>' + String(totalresult) + '</th></tr>';
                                }
                            }
                            else if(perm == 0){
                                innerstr = '<tr style="background-color: #ccc;"><th>No</th><th>学期</th><th>类别</th><th>语文</th><th>数学</th><th>英语</th><th>物理</th><th>化学</th><th>总分</th></tr>';
                                for(var i = 0; i < data.data.length; i++){
                                    innerstr += '<tr><th>' + String(i + 1 + offset) + '</th><th>' 
                                                + data.data[i].term + '</th><th>' + data.data[i].exam_type + '</th><th>' 
                                                + String(data.data[i].Chinese) + '</th><th>' + String(data.data[i].Math) + '</th><th>' 
                                                + String(data.data[i].English) + '</th><th>' + String(data.data[i].Physics) + '</th><th>' 
                                                + String(data.data[i].Chemistry) + '</th><th>' + String(data.data[i].Chinese + data.data[i].Math + data.data[i].English + data.data[i].Physics + data.data[i].Chemistry) + '</th></tr>';
                                }
                            }
                            innertable.innerHTML = innerstr;
                            document.getElementById("paging").style.display = 'block';
                            if(offset == 0){
                                document.getElementById("firstpage").disabled = true;
                                document.getElementById("previous").disabled = true;
                            }else{
                                document.getElementById("firstpage").disabled = false;
                                document.getElementById("previous").disabled = false;
                            }

                            if(offset >= (datalength - limit) || datalength < limit){
                                document.getElementById("next").disabled = true;
                                document.getElementById("lastpage").disabled = true;
                            }else{
                                document.getElementById("next").disabled = false;
                                document.getElementById("lastpage").disabled = false;
                            }
                    	},
                    })
                }

                $("#search").click(function(){
                    chinesetotal = 0;
                    mathtotal = 0;
                    englishtotal = 0;
                    physicstotal = 0;
                    chemistrytotal = 0;
                    totaltotal = 0;
                    semester = document.getElementById("semester").value;
                    examtype = document.getElementById("examtype").value;
                    grades = document.getElementById("grades").value;
                    classes = document.getElementById("classes").value;
                    stuname = document.getElementById("stuname").value;
                    offset = 0;
                    $.ajax({
                        type: "GET",
                        url: "/resultsearch",
                        data: {semester: semester, examtype: examtype, grades: grades, classes: classes, stuname: stuname, limit: limit, offset: offset},
                        dataType: 'json',
                        success:function(data){
                            console.log(data);
                            var innertable = document.getElementById("exmatbl");
                            var innerstr = '';
                            document.getElementById("nodata").innerHTML = '';
                            datalength = parseInt(data.count[0].count);
                            if(datalength != 0){
                                if(perm == 1){
                                    innerstr = '<tr style="background-color: #ccc;"><th>No</th><th>学号</th><th>姓名</th><th>学期</th><th>类别</th><th>班级</th><th>语文</th><th>数学</th><th>英语</th><th>物理</th><th>化学</th><th>总分</th></tr>';
                                    for(var i = 0; i < data.data.length; i++){
                                        var chinese = data.data[i].Chinese;
                                        var math = data.data[i].Math;
                                        var english = data.data[i].English;
                                        var physics = data.data[i].Physics;
                                        var chemistry = data.data[i].Chemistry;
                                        if(chinese == null){
                                            chinese = '未录入';
                                        }
                                        if(math == null){
                                            math = '未录入';
                                        }
                                        if(english == null){
                                            english = '未录入';
                                        }
                                        if(physics == null){
                                            physics = '未录入';
                                        }
                                        if(chemistry == null){
                                            chemistry = '未录入';
                                        }
                                        var totalresult = data.data[i].Chinese + data.data[i].Math + data.data[i].English + data.data[i].Physics + data.data[i].Chemistry;

                                        innerstr += '<tr><th>' + String(i + 1 + offset) + '</th><th><a href="/mangeinto?id=' + String(data.data[i].id) + '">' + data.data[i].stu_id + '</a></th><th>' + data.data[i].name + '</th><th>' 
                                                    + data.data[i].term + '</th><th>' + data.data[i].exam_type + '</th><th>' 
                                                    + String(data.data[i].grade) + '年' + String(data.data[i].class_num) + '班</th><th>' 
                                                    + String(chinese) + '</th><th>' + String(math) + '</th><th>' 
                                                    + String(english) + '</th><th>' + String(physics) + '</th><th>' 
                                                    + String(chemistry) + '</th><th>' + String(totalresult) + '</th></tr>';
                                    }
                                    for(var j = 0; j < data.alldata.length; j++){
                                        var totalresult2 = data.alldata[j].Chinese + data.alldata[j].Math + data.alldata[j].English + data.alldata[j].Physics + data.alldata[j].Chemistry;
                                        chinesetotal += data.alldata[j].Chinese;
                                        mathtotal += data.alldata[j].Math;
                                        englishtotal += data.alldata[j].English;
                                        physicstotal += data.alldata[j].Physics;
                                        chemistrytotal += data.alldata[j].Chemistry;
                                        totaltotal += totalresult2;
                                        if(maxresult < totalresult2){
                                            maxresult = totalresult2;
                                            maxstudent =  data.alldata[j].name;
                                        }
                                        if(chinesemax < data.alldata[j].Chinese){
                                            chinesemax = data.alldata[j].Chinese;
                                            chinesemaxname =  data.alldata[j].name;
                                        }
                                        if(mathmax < data.alldata[j].Math){
                                            mathmax = data.alldata[j].Math;
                                            mathmaxname =  data.alldata[j].name;
                                        }
                                        if(englishmax < data.alldata[j].English){
                                            englishmax = data.alldata[j].English;
                                            englishmaxname =  data.alldata[j].name;
                                        }
                                        if(physicsmax < data.alldata[j].Physics){
                                            physicsmax = data.alldata[j].Physics;
                                            physicsmaxname =  data.alldata[j].name;
                                        }
                                        if(chemistrymax < data.alldata[j].Chemistry){
                                            chemistrymax = data.alldata[j].Chemistry;
                                            chemistrymaxname =  data.alldata[j].name;
                                        }
                                    }
                                    $("#maxresult").text("最高分：语文：" + String(chinesemax) + "(" + String(chinesemaxname) + ")，数学：" + String(mathmax) + "(" + String(mathmaxname) 
                                                                         + ")，英语：" + String(englishmax) + "(" + String(englishmaxname) + ")，物理：" + String(physicsmax) + "(" + String(physicsmaxname) 
                                                                         + ")，化学：" + String(chemistrymax) + "(" + String(chemistrymaxname) + ")，总分："
                                                                         + String(maxresult) + "(" + String(maxstudent) + ")，平均成绩：语文：" + String(parseInt(chinesetotal/data.alldata.length)) 
                                                                         + "，数学：" + String(parseInt(mathtotal/data.alldata.length)) + "，英语：" + String(parseInt(englishtotal/data.alldata.length)) 
                                                                         + "，物理：" + String(parseInt(physicstotal/data.alldata.length)) + "，化学：" + String(parseInt(chemistrytotal/data.alldata.length)) 
                                                                         + "，总分：" + String(parseInt(totaltotal/data.alldata.length)));
                                }
                                else if(perm == 0){
                                    innerstr = '<tr style="background-color: #ccc;"><th>No</th><th>学期</th><th>类别</th><th>语文</th><th>数学</th><th>英语</th><th>物理</th><th>化学</th><th>总分</th></tr>';
                                    for(var i = 0; i < data.data.length; i++){
                                        innerstr += '<tr><th>' + String(i + 1 + offset) + '</th><th>' 
                                                    + data.data[i].term + '</th><th>' + data.data[i].exam_type + '</th><th>' 
                                                    + String(data.data[i].Chinese) + '</th><th>' + String(data.data[i].Math) + '</th><th>' 
                                                    + String(data.data[i].English) + '</th><th>' + String(data.data[i].Physics) + '</th><th>' 
                                                    + String(data.data[i].Chemistry) + '</th><th>' + String(data.data[i].Chinese + data.data[i].Math + data.data[i].English + data.data[i].Physics + data.data[i].Chemistry) + '</th></tr>';
                                    }
                                }
                                innertable.innerHTML = innerstr;
                                document.getElementById("paging").style.display = 'block';
                                document.getElementById("firstpage").disabled = true;
                                document.getElementById("previous").disabled = true;
                                if(datalength < limit){
                                    document.getElementById("next").disabled = true;
                                    document.getElementById("lastpage").disabled = true;
                                }else{
                                    document.getElementById("next").disabled = false;
                                    document.getElementById("lastpage").disabled = false;
                                }
                            }
                            else{
                                $("#maxresult").text("");
                                innertable.innerHTML = '';
                                document.getElementById("nodata").innerHTML = '<div class="alert alert-warning alert-dismissible" role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>没有符合条件的数据！</div>';
                                document.getElementById("paging").style.display = 'none';
                            }
                    	},
                    })
                });

                $("#firstpage").click(function(){
                    offset = 0;
                    dataload(semester, examtype, grades, classes, stuname, limit, offset, datalength);
                });

                $("#previous").click(function(){
                    offset = offset - limit;
                    dataload(semester, examtype, grades, classes, stuname, limit, offset, datalength);
                });

                $("#next").click(function(){
                    offset = offset + limit;
                    dataload(semester, examtype, grades, classes, stuname, limit, offset, datalength);
                });

                $("#lastpage").click(function(){
                    if(datalength % limit == 0){
                        offset = datalength - limit;
                    }else{
                        offset = datalength - (datalength % limit);
                    }
                    dataload(semester, examtype, grades, classes, stuname, limit, offset, datalength);
                });
                
                $(".pagesize").click(function(){
                    offset = 0;
                    limit = parseInt(this.innerHTML);
                    dataload(semester, examtype, grades, classes, stuname, limit, offset, datalength);
                });

                $("#clear").click(function(){
                    if(perm == 1){
                        document.getElementById("stuname").value = '';
	                    document.getElementById("grades").value = '';
	                    document.getElementById("classes").value = '';
                        stuname = '';
	                    grades = '';
	                    classes = '';
                    }
                    document.getElementById("semester").value = '';
                    document.getElementById("examtype").value = '';
                    semester = '';
                    examtype = '';
                })
            })
        </script>
        
    </head>
    <body>
        <form method="POST">
        <div th:replace="base/base::baseheader"></div>
        <div class="row content">
            <div th:replace="base/base::basemenu"></div>
            <div class="mainview">
                <div class="menutitle">
                    <b style="font-size: 26px;margin-left: 30px;">成绩查询</b>
                </div>
                <div style="margin-top:30px;">
                    <div class="col-md-1"> </div>
                    <div class="col-md-2">
                        <select class="form-control" name="semester" id="semester">
                            <option value="" hidden>--学期--</option>
                            <option th:each="item:${termlist}" th:value="${item}" th:text="${item}"></option>
                        </select>
                    </div>
                    <div class="col-md-2">
                        <select class="form-control" name="examtype" id="examtype">
                            <option value="" hidden>--考试类型--</option>
                            <option value="单元">单元</option>
                            <option value="期中">期中</option>
                            <option value="期末">期末</option>
                        </select>
                    </div>
                    <div class="col-md-1"></div>
                    <div th:if=" ${perm} eq '1'">
                        <div class="col-md-1">
                            <select class="form-control" name="grades" id="grades">
                                <option value="" hidden>--年级--</option>
                                <option value="1">1年级</option>
                                <option value="2">2年级</option>
                                <option value="3">3年级</option>
                            </select>
                        </div>
                        <div class="col-md-1">
                            <select class="form-control" name="classes" id="classes">
                                <option value="" hidden>--班级--</option>
                                <option value="1">1班</option>
                                <option value="2">2班</option>
                                <option value="3">3班</option>
                                <option value="4">4班</option>
                                <option value="5">5班</option>
                            </select>
                        </div>
                        <div class="col-md-2">
                            <input class="form-control" type="text" id="stuname" placeholder="学生姓名">
                        </div>
                    </div>
                    <div th:if=" ${perm} eq '0'">
                        <div class="col-md-4">
                            <input class="form-control" type="hidden" id="stuname" th:value="${name}">
                            <input class="form-control" type="hidden" id="grades" th:value="${grade}">
                            <input class="form-control" type="hidden" id="classes" th:value="${class_num}">
                        </div>
                    </div>
                    <div class="col-md-2">
                        <button id="search" class="btn btn-primary" type="button">查询</button>
                        <button id="clear" class="btn btn-default" type="button">清空</button>
                    </div>
                </div>
                <div>
                    <div class="col-md-1"></div>
                    <div class="col-md-10" style="height:calc(100vh - 310px);margin-top:30px;overflow-y: auto;">
                        <div id="maxresult" style="font-weight: 700;"></div>
                        <div id="nodata"></div>
                        <table id="exmatbl" class="table table-bordered table-hover col-md-6" style="margin: 30px 0;">
                            
                        </table>
                    </div>
                    <div class="col-md-1"></div>
                </div>
                <div id="paging" style="height:40px;display:none;width:362px;margin: 0 auto;margin-top:calc(100vh - 220px);">
                    <div class="btn-group" role="group" aria-label="...">
                        <button type="button" id="firstpage" class="btn btn-default">首页</button>
                        <button type="button" id="previous" class="btn btn-default">上一页</button>
                        <button type="button" id="next" class="btn btn-default">下一页</button>
                        <button type="button" id="lastpage" class="btn btn-default">尾页</button>
                        <div class="btn-group dropup">
                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                设置每页条数 <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu">
                                <li><a class="pagesize">5</a></li>
                                <li><a class="pagesize">10</a></li>
                                <li><a class="pagesize">15</a></li>
                                <li><a class="pagesize">20</a></li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div th:replace="base/base::basefooter"></div>

    </form>

        <script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"></script>
    </body>
</html>
